<template>
  <div class="modify-dialog">
    <slot></slot>
    <el-dialog :close-on-click-modal="false" v-bind="dialogOpts" :visible.sync="dialogVisible">
      <Form v-bind="formOpts" v-on="formEvent">
        <template #formSuf>
          <div class="addition-wrap">
            <div class="addition" v-for="(e, i) in addition" :key="e.id + i">
              <div class="name">{{ e.productName }}</div>
              <el-input-number v-model="e.count" :min="0" :max="100000"></el-input-number>
            </div>
          </div>
        </template>
        <template #formBtn>
          <div class="dialog-footer">
            <el-button @click="dialogVisible = false">取 消</el-button>
            <el-button type="primary" @click="onConfirm"> 确 定</el-button>
          </div>
        </template>
      </Form>
    </el-dialog>
  </div>
</template>

<script>
import modifyMixins from "@/mixins/modifyMixins.vue";

export default {
  mixins: [modifyMixins],
  data() {
    return {
      labelPosition: "left",
      addition: [],
      form: {},
    };
  },
  computed: {
    title() {
      return "杂项录入";
    },
  },
  mounted() {
  },
  methods: {
    showDialog(modify = "add", row = {}) {
      this.dialogVisible = true;
      this.row = row;
      this.modify = modify || "add";
      for (const key in this.form) {
        if (Object.hasOwnProperty.call(row, key))
          this.form[key].value = row[key] || "";
        else this.form[key].value = "";
      }
      this.formKey = this.$quinn.guid();
      // /order/additionList
      // "materialMaterialAdditionList"
      this.$api["orderAdditionList"]({ orderId: row.id }).then((res) => {
        const dataArr = [];
        res.map(el => {
          if (el.productCode == 'SCB-TZ' || el.productCode == 'SCB-3' || el.productCode == 'UXKK') {

          } else {
            dataArr.push(el)
          }
        })
        this.addition = (dataArr || []).map((e) => {
          return e;
        });
      });
    },
    onSubmit(form) {
      const { modify, row, addition, fileList2 } = this;
      // if (addition.every((e) => !e.count)) return this.$message.error("请输入");
      form.id = row.id;
      form.additions = addition
        .filter((e) => e.count)
        .map((e) => {
          return {
            id: e.id,
            count: e.count,
          };
        });
      // newOrderUpdate
      this.$api["orderInsertAddition"](form).then(this.submitDoneMsg);
    },
  },
};
</script>

<style lang="less" scoped>
.addition-wrap {
  height: 60vh;
  overflow-y: auto;
  margin: 20px 0;

  .addition {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 8px 0;

    .name {
      padding-right: 20px;
    }
  }
}
</style>
